<template>
    <div class="flex-row flex-center" style="height: 70vh;">
        <div class="container-lg my-3" style="width: 60vw;">
            <div class="col-12 d-flex px-0 flex-column">
                <div class="bg-light-grey px-md-5 px-sm-3 px-0 py-sm-3">
                    <h1 class="h3 my-3 text-primary">联系我们</h1>
                    <p>请通过958829513@qq.com邮件联系我们，并且附上所需的信息。我们将尽量在3天内回复您的邮件。</p>
                    <h2 class="h4 text-primary">邮件指南</h2>

                    <div class="my-2 font-weight-bold" id="report-bug">1. 如果你发现本站存在 Bug，请联系我们并附上以下信息</div>
                    <ul>
                        <li>描述具体发生了什么</li>
                        <li>出现 Bug 的具体页面网址</li>
                        <li>网页上的错误信息</li>
                        <li>网页截图</li>
                        <li>你的操作系统，浏览器版本，设备等等</li>
                    </ul>

                    <div class="my-2 font-weight-bold" id="incorrect-info">2. 网站上的错误信息</div>
                    <p>
                        如果你发现本站存在错误信息，如学校网址、缩写、导师姓名、邮箱、院系、不实评价等等，欢迎联系我们。请在邮件里附上具体的网址、错误信息和对应的正确信息。
                    </p>
                    <p>
                        为了网站的稳定运行，某些已申诉修改的评价可能会显示已和谐等字样。
                    </p>
                </div>
            </div>
        </div>
    </div>
</template>

<script>
export default {

}
</script>

<style scope>
.text-primary {
    color: #007bff !important;
}

.font-weight-bold {
    font-weight: 700 !important;
}

p {
    margin-top: 0;
    margin-bottom: 1rem;
}

.mb-3,
.my-3 {
    margin-bottom: 1rem !important;
}

.h4,
h4 {
    font-size: 1.5rem;
}

.col-12 {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
}

.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
h1,
h2,
h3,
h4,
h5,
h6 {
    margin-bottom: .5rem;
    font-weight: 500;
    line-height: 1.2;
}

.mt-2,
.my-2 {
    margin-top: .5rem !important;
}

.mb-2, .my-2 {
    margin-bottom: .5rem!important;
}
ul{
    margin-left: 28px;
}
</style>